
import 'package:flutter/material.dart';

class ListViewDemo extends StatelessWidget {
  const ListViewDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        ListViewBasic(),
        ListViewHorizontal(),
        ListViewBuilderDemo(),
        ListViewSeperateDemo()
      ],
    );
  }
}

class ListViewSeperateDemo extends StatelessWidget {
  ListViewSeperateDemo({super.key});

  Widget divider1 = const Divider(color: Colors.red, thickness: 1,);
  Widget divider2 = const Divider(color: Colors.blue, thickness: 1,);

  final List<Widget> products = List<Widget>.generate(20, (idx) =>
      ListTile(
        leading: Image.asset('images/stratos-0.jpg', width: 50, height: 50),
        title: Text('产品 xxx手机 $idx '),
        subtitle: const Text('子标题'),
        trailing: const Icon(Icons.keyboard_arrow_right, size: 25),
      ),
  );

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        const ListTile(title: Text('商品列表')),
        Container(
          height: 200,
          child: ListView.separated(
            itemCount: products.length,
            separatorBuilder: (BuildContext context, int index) {
              return products[index];
            },
            itemBuilder: (BuildContext context, int index) {
              bool isOdd = index % 2 == 0;
              return isOdd ? divider1 : divider2;
            },
          ),
        )

      ],
    );
  }
}

class ListViewBuilderDemo extends StatelessWidget {
  ListViewBuilderDemo({super.key});

  final List<Widget> users = List<Widget>.generate(20, (idx) =>
      OutlinedButton(
          onPressed: (){},
          child: Text('姓名 张三$idx')
      )
  );

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 150,
      child: ListView.builder(
        itemCount: users.length,
        itemExtent: 30,
        itemBuilder: (ctx, idx) {
          return users[idx];
        },
      ),
    );
  }
}

class ListViewHorizontal extends StatelessWidget {
  const ListViewHorizontal({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 100,
      child: ListView(
        scrollDirection: Axis.horizontal,
        children: [
          Container(width: 160, color: Colors.amber,),
          Container(width: 160, color: Colors.blueAccent,),
          Container(width: 160, color: Colors.black87,),
          Container(width: 160, color: Colors.grey,),
        ],

      ),
    );
  }
}

class ListViewBasic extends StatelessWidget {
  const ListViewBasic({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 200,
      child: ListView(
        children: [
          const ListTile(
            leading: Icon(Icons.access_alarm, size: 25,),
            title: Text('access_alarm'),
            subtitle: Text('子标题'),
            trailing: Icon(Icons.keyboard_arrow_right, size: 25),
          ),
          ListTile(
            leading: const Icon(Icons.ac_unit, size: 25,),
            title: const Text('ac_unit'),
            subtitle: const Text('子标题'),
            trailing: const Icon(Icons.keyboard_arrow_right, size: 25),
            selected: true, /* 选中状态设置 */
            selectedTileColor: Colors.lightBlue[50],
          ),
          const ListTile(
            leading: Icon(Icons.add_photo_alternate_rounded, size: 25,),
            title: Text('add_photo_alternate_rounded'),
            subtitle: Text('子标题'),
            trailing: Icon(Icons.keyboard_arrow_right, size: 25),
          ),
          const ListTile(
            leading: Icon(Icons.fact_check_outlined, size: 25,),
            title: Text('fact_check_outlined'),
            subtitle: Text('子标题'),
            trailing: Icon(Icons.keyboard_arrow_right, size: 25),
          )
        ],
      ),
    );
  }

}